<!--
 * @Author: yeminglong
 * @Date: 2023-10-23 11:12:28
 * @LastEditTime: 2023-10-23 14:37:21
 * @LastEditors: yeminglong
 * @Description: 
-->
<template>
  <div ref="videoPlayerRef" style="width: 100%;height: 100%;"></div>
</template>
<script setup>
import DPlayer from "dplayer";
const videoPlayerRef = ref(null);
const myPlayer = ref(null);

onMounted(() => {
  myPlayer.value = new DPlayer({
    container: videoPlayerRef.value,
    theme: "#b7daff",
    video: {
      url: "//sf1-hscdn-tos.pstatp.com/obj/media-fe/xgplayer_doc_video/mp4/xgplayer-demo-720p.mp4",
    },
  });
});

onUnmounted(() => {
  if (myPlayer.value) {
    myPlayer.value.destroy();
  }
});
</script>